<ion-header>
  <ion-navbar color="primary">
    <ion-title>
      待办事项
    </ion-title>
    <ion-buttons end>
    <button ion-button icon-left(click)="addTask()">
      <ion-icon name="add"></ion-icon>
      <!--新增--></button>
  </ion-buttons>
    </ion-navbar>
</ion-header>

<ion-content padding>
  <ion-refresher(ion-refresher)="doRefresh($event)">
    <ion-refresher-content
    pullingIcon="arrow-dropdown"
    pullingText="下拉刷新"
    refreshingSpinner="circles"
    refreshingText="刷新...">

    </ion-refresher-content
    >
  </ion-refresher(ion-refresher)>
  <ion-list>
    <ion-item-sliding #slidingItem *ngFor="let task of tasks">
      <ion-item [ngClass]="{'task-done':task.status==='done'}">{{task.title}}</ion-item>
      <ion-item-options side="right" (ionSwipe)="removeTask"(slidingItem,task)>
        <button ion-button icon-only color="secondary" (click="markAsDone
        (slidingItem,task)">
          <ion-icon  name="checkmark"></ion-icon>
        </button>
        <button ion-button icon-only expandable color="danger" (click="removeTask(task)
        (slidingItem,task)>
          <ion-icon name="trash"></ion-icon>
        </button>

      </ion-item-options>
    </ion-item-sliding>
    
  </ion-list>
  The world is your oyster.
  <p>
    If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
  </p>
</ion-content>
